<template>
  <div>
    <h1>文本挖掘</h1>
    <common-echarts
      :option="option"
      ref="echarts"
      :width="600"
      :height="600"
    ></common-echarts>
  </div>
</template>

<script>
// import * as echarts from "echarts";
import CommonEcharts from "@/components/echarts/echarts.vue";

export default {
  name: "SpiderEcharts",
  components: {
    CommonEcharts,
  },
  computed: {
    option() {
      let data = [
        {
          name: "自主创新",
          draggable: "true",
          symbolSize: 49,
          label: { normal: { color: "black" } },
        },
        {
          name: "信息化委",
          draggable: "true",
          symbolSize: 17,
          label: { normal: { color: "black" } },
        },
        {
          name: "创新示范区",
          draggable: "true",
          symbolSize: 36,
          label: { normal: { color: "black" } },
        },
        {
          name: "小微企业",
          draggable: "true",
          symbolSize: 24,
          label: { normal: { color: "black" } },
        },
        {
          name: "成果转化",
          draggable: "true",
          symbolSize: 51,
          label: { normal: { color: "black" } },
        },
        {
          name: "改革委",
          draggable: "true",
          symbolSize: 33,
          label: { normal: { color: "black" } },
        },
        {
          name: "全民科学",
          draggable: "true",
          symbolSize: 4,
          label: { normal: { color: "black" } },
        },
        {
          name: "印发给",
          draggable: "true",
          symbolSize: 45,
          label: { normal: { color: "black" } },
        },
        {
          name: "住房城乡建设",
          draggable: "true",
          symbolSize: 19,
          label: { normal: { color: "black" } },
        },
        {
          name: "decoration:",
          draggable: "true",
          symbolSize: 32,
          label: { normal: { color: "black" } },
        },
        {
          name: "租金减免",
          draggable: "true",
          symbolSize: 2,
          label: { normal: { color: "black" } },
        },
        {
          name: "市发展",
          draggable: "true",
          symbolSize: 39,
          label: { normal: { color: "black" } },
        },
        {
          name: "市住房",
          draggable: "true",
          symbolSize: 16,
          label: { normal: { color: "black" } },
        },
        {
          name: "color:",
          draggable: "true",
          symbolSize: 42,
          label: { normal: { color: "black" } },
        },
        {
          name: "国家自主",
          draggable: "true",
          symbolSize: 32,
          label: { normal: { color: "black" } },
        },
        {
          name: "发展改革",
          draggable: "true",
          symbolSize: 44,
          label: { normal: { color: "black" } },
        },
        {
          name: "各市属",
          draggable: "true",
          symbolSize: 62,
          label: { normal: { color: "black" } },
        },
        {
          name: "市商务局",
          draggable: "true",
          symbolSize: 10,
          label: { normal: { color: "black" } },
        },
        {
          name: "市科委",
          draggable: "true",
          symbolSize: 40,
          label: { normal: { color: "black" } },
        },
        {
          name: "科技创新",
          draggable: "true",
          symbolSize: 62,
          label: { normal: { color: "black" } },
        },
        {
          name: "创新中心",
          draggable: "true",
          symbolSize: 43,
          label: { normal: { color: "black" } },
        },
        {
          name: "给你们",
          draggable: "true",
          symbolSize: 53,
          label: { normal: { color: "black" } },
        },
        {
          name: "属机构",
          draggable: "true",
          symbolSize: 64,
          label: { normal: { color: "black" } },
        },
        {
          name: "科技成果转化",
          draggable: "true",
          symbolSize: 34,
          label: { normal: { color: "black" } },
        },
        {
          name: "经济信息化",
          draggable: "true",
          symbolSize: 18,
          label: { normal: { color: "black" } },
        },
        {
          name: "中关村国家",
          draggable: "true",
          symbolSize: 33,
          label: { normal: { color: "black" } },
        },
        {
          name: "金融监管局",
          draggable: "true",
          symbolSize: 8,
          label: { normal: { color: "black" } },
        },
        {
          name: "市财政局",
          draggable: "true",
          symbolSize: 32,
          label: { normal: { color: "black" } },
        },
        {
          name: "微企业",
          draggable: "true",
          symbolSize: 24,
          label: { normal: { color: "black" } },
        },
        {
          name: "减免租金",
          draggable: "true",
          symbolSize: 3,
          label: { normal: { color: "black" } },
        },
        {
          name: "市政府各委",
          draggable: "true",
          symbolSize: 62,
          label: { normal: { color: "black" } },
        },
        {
          name: "科学素质",
          draggable: "true",
          symbolSize: 5,
          label: { normal: { color: "black" } },
        },
        {
          name: "素质建设",
          draggable: "true",
          symbolSize: 3,
          label: { normal: { color: "black" } },
        },
        {
          name: "信息化局",
          draggable: "true",
          symbolSize: 10,
          label: { normal: { color: "black" } },
        },
        {
          name: "城乡建设委",
          draggable: "true",
          symbolSize: 15,
          label: { normal: { color: "black" } },
        },
        {
          name: "政策解读",
          draggable: "true",
          symbolSize: 44,
          label: { normal: { color: "black" } },
        },
      ];

      let links = [
        {
          source: "微企业",
          target: "小微企业",
          lineStyle: { normal: { width: 10.000000000000002 } },
        },
        {
          source: "市政府各委",
          target: "各市属",
          lineStyle: { normal: { width: 10.0 } },
        },
        {
          source: "属机构",
          target: "各市属",
          lineStyle: { normal: { width: 9.842509842514763 } },
        },
        {
          source: "市政府各委",
          target: "属机构",
          lineStyle: { normal: { width: 9.842509842514763 } },
        },
        {
          source: "政策解读",
          target: "color:",
          lineStyle: { normal: { width: 9.770084209183944 } },
        },
        {
          source: "经济信息化",
          target: "信息化委",
          lineStyle: { normal: { width: 9.718253158075502 } },
        },
        {
          source: "市住房",
          target: "城乡建设委",
          lineStyle: { normal: { width: 9.682458365518542 } },
        },
        {
          source: "国家自主",
          target: "中关村国家",
          lineStyle: { normal: { width: 9.539590550898286 } },
        },
        {
          source: "国家自主",
          target: "创新示范区",
          lineStyle: { normal: { width: 9.428090415820632 } },
        },
        {
          source: "改革委",
          target: "市财政局",
          lineStyle: { normal: { width: 9.231861823449954 } },
        },
        {
          source: "给你们",
          target: "印发给",
          lineStyle: { normal: { width: 9.214426752509269 } },
        },
        {
          source: "市商务局",
          target: "信息化局",
          lineStyle: { normal: { width: 8.999999999999998 } },
        },
        {
          source: "创新示范区",
          target: "中关村国家",
          lineStyle: { normal: { width: 8.994012224377721 } },
        },
        {
          source: "科学素质",
          target: "全民科学",
          lineStyle: { normal: { width: 8.94427190999916 } },
        },
        {
          source: "金融监管局",
          target: "信息化局",
          lineStyle: { normal: { width: 8.94427190999916 } },
        },
        {
          source: "城乡建设委",
          target: "住房城乡建设",
          lineStyle: { normal: { width: 8.885233166386385 } },
        },
        {
          source: "decoration:",
          target: "color:",
          lineStyle: { normal: { width: 8.728715609439693 } },
        },
        {
          source: "改革委",
          target: "发展改革",
          lineStyle: { normal: { width: 8.660254037844387 } },
        },
        {
          source: "素质建设",
          target: "全民科学",
          lineStyle: { normal: { width: 8.660254037844387 } },
        },
        {
          source: "市住房",
          target: "住房城乡建设",
          lineStyle: { normal: { width: 8.603090020146066 } },
        },
        {
          source: "改革委",
          target: "市科委",
          lineStyle: { normal: { width: 8.532469179729295 } },
        },
        {
          source: "政策解读",
          target: "decoration:",
          lineStyle: { normal: { width: 8.528028654224416 } },
        },
        {
          source: "市发展",
          target: "发展改革",
          lineStyle: { normal: { width: 8.449079617742182 } },
        },
        {
          source: "市财政局",
          target: "市科委",
          lineStyle: { normal: { width: 8.38525491562421 } },
        },
        {
          source: "改革委",
          target: "市发展",
          lineStyle: { normal: { width: 8.362420100070908 } },
        },
        {
          source: "自主创新",
          target: "创新示范区",
          lineStyle: { normal: { width: 8.333333333333334 } },
        },
        {
          source: "科技成果转化",
          target: "成果转化",
          lineStyle: { normal: { width: 8.164965809277259 } },
        },
        {
          source: "租金减免",
          target: "减免租金",
          lineStyle: { normal: { width: 8.164965809277259 } },
        },
        {
          source: "科技创新",
          target: "创新中心",
          lineStyle: { normal: { width: 8.134281875827076 } },
        },
        {
          source: "自主创新",
          target: "国家自主",
          lineStyle: { normal: { width: 8.081220356417685 } },
        },
      ];

      let series1 = {
        type: "graph", //节点关系图
        layout: "force", //力导向布局图
        symbolSize: 300, //图形的大小
        roam: true, //支持鼠标缩放及平移
        //鼠标移到节点上的时候突出显示节点、边和邻接节点
        focusNodeAdjacency: true,
        label: {
          normal: {
            show: true, //控制非高亮时节点名称是否显示
            position: "",
            fontSize: 12, //字体大小
            color: "#f00",
          },
          emphasis: {
            show: true,
            position: "right",
            fontSize: 16,
            color: "#0f0",
          },
        },
        force: {
          //力的相关设置
          x: "center",
          y: "50px",
          edgeLength: 80, // 边的两个节点之间的距离
          repulsion: 100, //节点之间的斥力因子
        },
        edgeLabel: {
          //线条的边缘标签设置
          normal: {
            show: false,
            textStyle: { fontSize: 12 },
            formatter: "{c}", //显示形式
          },
          emphasis: {
            show: true,
            textStyle: { fontSize: 14 },
          },
        },
        data,
        links,
      };

      return {
        title: {
          text: "北京市公开政策法规文本挖掘",
          subtext: "节点关系图",
        },
        backgroundColor: "#f3f3f3",
        //背景色
        // backgroundColor: new echarts.graphic.RadialGradient(0.1, 0.6, 1, [
        //   {
        //     color: "rgba(255, 145, 124, 0.1)",
        //     offset: 0,
        //   },
        //   {
        //     color: "rgba(255, 145, 124, 0.9)",
        //     offset: 1,
        //   },
        // ]),
        series: [series1],
      };
    },
  },
  data() {
    return {};
  },
  methods: {
    refresh() {
      console.log("option:", this.option);
      this.$nextTick(this.$refs.echarts.refresh);
    },
  },
};
</script>
